<template>
  <div>
    <h3>App组件的属性</h3>
    <div>
      <h3>姓名：{{ porsne.name }}</h3>
      <h3>年龄：{{ porsne.age }}</h3>
      <h3>性别：{{ porsne.sex }}</h3>
      <h3>爱好：{{ porsne.hobby }}</h3>
    </div>
    <hr />
    <br />
    <Son v-bind="porsne" v-bind:changeData="changeData"/>
  </div>
</template>

<script>
import Son from "@/components/Son";
export default {
  name: "App",
  data() {
    return {
      porsne: {
        name: "张三",
        age: "18",
        sex: "男",
        hobby: "打篮球",
      },
    };
  },
  methods:{
    changeData(date){
      this.porsne = date
    }
  },
  components: {
    Son,
  },
};
</script>

<style>
</style>